/**
 * PostCss的配置文件
 * (行内样式不会转换)
 * PostCSS是 基于Node.js运行的一个处理CSS的工具的
 * 所以他的配置文件也是运行在Node.js中
 * **/

// PostCSS配置文件需要导出一个对象
 module.exports = {
   // 要使用的相关插件
  plugins: {
    // 添加浏览器厂商的前缀(兼容)
    // 'autoprefixer': {  
      // browsers 用来配置要兼容的浏览器环境
      // 这个配置没有问题, 但是写到这里会有控制台编译警告
      // 为什么? 因为VueCLI 是通过项目中的
      // .browserslistrc 文件来配置要兼容的环境信息的

      // 'browsers': ['Android>=4.0', 'iOS>=8.0']  将这个配置到browserslistrc 文件中
    // },
    // 将PX单位转REN
    'postcss-pxtorem': {
      // 根元素的基准值
      // 正常情况下是按照你的设计稿来
      //  750宽的设计稿, 基准值是 75
      // 375的宽设计稿, 基准值是37.5
      // Vant组件库是基于375的设计稿,
      // 移动端页面一般都是iphone6/7/8为原型设计的
      // Vant组件库是基于逻辑像素 375 写的,

      // 但我们设计稿为750时, 测量出的的长度要先 / 2
      // 有没有更好的办法, 不用计算; (修改设计稿的宽度)
      rootValue: 37.5,
      // 需要转换的CSS属性, * 就是所有是所有属性都要转换
      // propList: ['font-size'],
      propList: ['*'],
    },
  },
};